<!DOCTYPE html>
<html lang="zh-cmn-Hans">

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
		<script type="text/javascript" src="Plug/jquery-1.11.3.min.js"></script>
		<title>首页</title>
		<script src="Plug/layer-v3.1.1/layer.js" type="text/javascript" charset="utf-8"></script>
		<!--layer  弹框插件-->
		<link rel="stylesheet" href="static/css/base/reset.css" />
		<!--jqyery-weiui插件 -->
		<link rel="stylesheet" href="Plug/jquery-weui/jquery-weui.min.css">
		<link rel="stylesheet" href="Plug/jquery-weui/weui.min.css">
		<script src="Plug/jquery-weui/js/jquery-weui.js" type="text/javascript" charset="utf-8"></script>
		<script src="Plug/jquery-weui/js/city-picker.js" type="text/javascript" charset="utf-8"></script>
		<!--重置样式-->
		<link rel="stylesheet" href="static/css/base/main.css" />
		<!--公共样式-->
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_990287_0yboerxjx8xc.css" />
		<!--阿里云图标库-->
		<script src="static/js/base.js" type="text/javascript" charset="utf-8"></script>
		<!---------------公共导入分割线------------------------>
		<!--轮播插件-->
		<link rel="stylesheet" type="text/css" href="Plug/swiper/swiper.min.css" />
		<script src="Plug/swiper/swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="static/css/login/index.css" />
		<!--首页样式-->
	</head>

	<body>
		<div class="have_bar_wrap">
			<!--搜索-->
			<div class="index_search flex_cb">
				<div class="index_search_l flex_cc">
					<i class="iconfont icon-search"></i>
					<input placeholder="你想要搜索什么？" type="" name="" id="" value="" />
				</div>
				<a class="screen_btn" href="javascript:void(0)"><i class="iconfont icon-fenlei"></i></a>
			</div>
			<!--主页顶部-->
			<div class="index_top">
				<div class="main_box">
					<div class="banner_wrap">
						<div class="swiper-container banner_tab">
							<div class="swiper-wrapper">
								<a class="swiper-slide" href="login.html"><img src="static/images/index_banner.jpg" /></a>
								<a class="swiper-slide" href="password.html"><img src="static/images/index_banner.jpg" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/index_banner.jpg" /></a>
							</div>
						</div>
						<!-- 如果需要分页器 -->
						<div class="swiper-pagination banner_tab_pagination"></div>
					</div>
					<div class="index_entrance flex_ca">
						<a href="index_into_model.html">
							<i class="mttj_icon"></i> 模特推荐
						</a>
						<a href="index_into_ypxx.html">
							<i class="ypxx_icon"></i> 约拍信息
						</a>
						<a href="index_into_meitu.html">
							<i class="ypmt_icon"></i> 约拍美图
						</a>
						<a href="javascript:void(0)">
							<i class="ypqz_icon"></i> 约拍圈子
						</a>
					</div>
					<div class="index_entrance flex_ca">
						<a href="index_into_mail.html">
							<i class="jpfw_icon"></i> 寄拍服务
						</a>
						<a href="javascript:void(0)">
							<i class="hdtg_icon"></i> 活动通告
						</a>
						<a href="javascript:void(0)">
							<i class="djch_icon"></i> 独家策划
						</a>
						<a href="javascript:void(0)">
							<i class="zzxxk_icon"></i> 制作形象卡
						</a>
					</div>
				</div>
			</div>
			<!--红人推荐-->
			<div class="hot_model">
				<div class="main_box">
					<div class="hot_model_tit flex_cb">
						<div class="hot_model_tit_l flex_cl">
							<span class="hot_model_lname">红人推荐</span>
							<span class="hot_model_ltip">CHIC RECOMMENDATION</span>
						</div>
						<a class="hot_more flex_cc" href="javascript:void(0)">
							<span>MORE</span>
							<i class="iconfont icon-xuanzeqixiayige"></i>
						</a>
					</div>
					<div class="hot_model_list flex_tb">
						<div class="hot_model_list_l">
							<a href="javascript:void(0)">
								<img src="static/images/changkuan21.png" />
								<div class="hot_model_list_tip">
									<img src="static/images/changkuan21.png" />
									<span class="hot_model_list_name">雨诗</span>
									<span class="hot_model_list_occupation flex_cc">模特</span>
								</div>
							</a>
							<a href="javascript:void(0)">
								<img src="static/images/changkuan12.png" />
								<div class="hot_model_list_tip">
									<img src="static/images/changkuan21.png" />
									<span class="hot_model_list_name">林可可</span>
									<span class="hot_model_list_occupation flex_cc">摄影</span>
								</div>
							</a>
						</div>
						<div class="hot_model_list_r">
							<a href="javascript:void(0)">
								<img src="static/images/changkuan12.png" />
								<div class="hot_model_list_tip">
									<img src="static/images/changkuan21.png" />
									<span class="hot_model_list_name">林可可</span>
									<span class="hot_model_list_occupation flex_cc">模特</span>
								</div>
							</a>
							<a href="javascript:void(0)">
								<img src="static/images/changkuan21.png" />
								<div class="hot_model_list_tip">
									<img src="static/images/changkuan21.png" />
									<span class="hot_model_list_name">林可可</span>
									<span class="hot_model_list_occupation flex_cc">模特</span>
								</div>
							</a>
						</div>
					</div>
				</div>
			</div>
			<div class="index_screen flex_cc">
				<a id="city-picker" href="javascript:void(0)">地区<i class="iconfont icon-caret-down"></i></a>
				<a id="index-type" href="javascript:void(0)">类别<i class="iconfont icon-caret-down"></i></a>
			</div>
			<!--约摄影师-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_tb">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png" />
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王木林森</span>
								<i class="iconfont icon-woman"></i>
								<b class="real_name_icon">已实名</b>
								<b class="guarantee_icon">信用担保</b>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>成都</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_red">约摄影师</span>
						<p>希望可以互免</p>
					</div>
					<div class="yp_info_content">
						在昆明市区街拍需提前预约，有其他问题电联~
					</div>
					<div class="photo_wrap">
						<div class="swiper-container yp_swiper">
							<div class="swiper-wrapper" thumblist="list1">
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
							</div>
						</div>
					</div>
					<div class="yp_reader">
						<span>一小时前</span>
						<span>阅读&nbsp;429</span>
					</div>
					<div class="model_tips">
						<span>性感</span>
						<span>内衣</span>
						<span>成熟</span>
					</div>
				</div>
			</div>
			<!--约拍模特-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png" />
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王木林森</span>
								<i class="iconfont icon-man"></i>
								<b class="real_name_icon">已实名</b>
								<b class="guarantee_icon">信用担保</b>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>成都</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_blue">约拍模特</span>
						<p>希望收费<span class="price_type">330元/天</span></p>
					</div>
					<div class="yp_info_content">
						在昆明市区街拍需提前预约，有其他问题电联~在昆明市区街拍需提前预约，有其他问题电联~在昆明市区街拍需提前预约，有其他问题电联~在昆明市区街拍需提前预约，有其他问题电联~
					</div>
					<div class="photo_wrap">
						<div class="swiper-container yp_swiper">
							<div class="swiper-wrapper"  thumblist="list2">
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
							</div>
						</div>
					</div>
					<div class="yp_reader">
						<span>一小时前</span>
						<span>阅读&nbsp;429</span>
					</div>
					<div class="model_tips">
						<span>性感</span>
						<span>内衣</span>
						<span>成熟</span>
					</div>
				</div>
			</div>
			<!--约拍美图-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png" />
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王木</span>
								<i class="iconfont icon-man"></i>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>成都</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_yellow">约拍美图</span>
					</div>
					<div class="yp_info_content">
						拍个有点个性的，你喜欢吗？
					</div>
					<div class="photo_wrap">
						<div class="swiper-container yp_swiper">
							<div class="swiper-wrapper">
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
							</div>
						</div>
					</div>
					<div class="yp_reader">
						<span>一小时前</span>
						<span>阅读&nbsp;429</span>
					</div>
					<div class="model_tips">
						<span>性感</span>
						<span>内衣</span>
						<span>成熟</span>
					</div>
				</div>
			</div>
			<!--商品寄拍-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png" />
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王木</span>
								<i class="iconfont icon-man"></i>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>成都</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_blue">商品寄拍</span>
						<p>找模特 · 有偿服务</p>
					</div>
					<div class="photo_wrap yp_map_wrap flex_tb jp_wrap">
						<div class="swiper-container yp_map_img">
							<div class="swiper-wrapper">
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
							</div>
						</div>
						<div class="yp_map_info">
							<p class="yp_map_tit">夏季白色泳装淘宝商淘宝商品照品照</p>
							<p class="jp_fanwei"><span>寄拍范围：</span><span>不限</span></p>
							<ul class="jp_tips">
								<li>欧美</li>
								<li>日系</li>
								<li>港风</li>
								<li>日系</li>
								<li>港风</li>
							</ul>
							<div class="yp_map_info_b jp_money">
								<span>愿意付费</span><span class="jp_money_num">220</span>元/件
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--约拍地图-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png" />
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王木</span>
								<i class="iconfont icon-man"></i>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>重庆市</span>
						</div>
					</div>
					<div class="photo_wrap yp_map_wrap flex_tb">
						<div class="swiper-container yp_map_img">
							<div class="swiper-wrapper">
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
								<a class="swiper-slide" href="javascript:void(0)"><img src="static/images/changkuan11.png" /></a>
							</div>
						</div>
						<div class="yp_map_info">
							<span class="subtit_type subtit_type_zi">约拍地图</span>
							<p class="yp_map_tit">这里是场地名称</p>
							<p class="yp_map_content">北京798拍照圣地再次来到798这里是地点 再次来到798这里是地点描述描述</p>
							<div class="yp_map_info_b flex_cl">
								<div class="yp_map_info_b_tip">
									<i class="iconfont icon-weilingshitu"></i>
									<span>景点</span>
								</div>
								<div class="yp_map_info_b_tip">
									<i class="iconfont icon-weizhi1"></i>
									<span>渝中区</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--活动信息-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png" />
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王小宇</span>
								<i class="iconfont icon-man"></i>
								<b class="real_name_icon">已实名</b>
								<b class="guarantee_icon">信用担保</b>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>杭州</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_green">活动通知</span>
						<p>杭州魔法空间百万年薪招募新模</p>
					</div>
					<div class="activity_list flex_cl">
						<i class="iconfont icon-sound"></i>
						<p>线上活动·网络推广</p>
					</div>
					<div class="activity_list flex_cl">
						<i class="iconfont icon-time-circle"></i>
						<p>2019.8.8~2019.8.31</p>
					</div>
					<div class="activity_list flex_cb">
						<div class="flex_cl">
							<i class="iconfont icon-weizhi1"></i>
							<p>不限</p>
							<i class="iconfont icon-team"></i>
							<p>30人</p>
						</div>
						<div class="activity_list_r">100000<span>元/人</span></div>
					</div>
					<div class="activity_list_all">
						已有<span>8</span>位红人报名
					</div>
					<div class="activity_list_headlist">
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
						<img src="static/images/changkuan21.png" />
					</div>
				</div>
			</div>
		</div>
		<!--底部切换bar-->
		<div class="footer_bar">
			<a class="bar_index footer_bar_action" href="javascript:void(0)"><i></i>首页</a>
			<a class="bar_screen" href="javascript:void(0)"><i></i>筛选</a>
			<a href="javascript:void(0)">
				<div class="bar_fabu_in"><i class="iconfont icon-jiahao"></i></div>
			</a>
			<a class="bar_msg" href="javascript:void(0)"><i></i>消息</a>
			<a class="bar_my" href="my.html"><i></i>我的</a>
		</div>
		<!--返回顶部-->
		<div class="back_top">
			<i class="iconfont icon-fanhuidingbu"></i>
		</div>
		<!--订阅我们-->
		<div onclick="call_box()" class="callme_fixed">
			<p>订阅</p>
			<p>我们</p>
		</div>
		<!--订阅我们弹框-->
		<div class="callme_box">
			<div class="callme_box_content">
				<img src="static/images/erweima.jpg" />
				<p>长按二维码识别订阅我们</p>
			</div>
			<div class="alert_btnwrap">
				<a class="ok_alert" href="javascript:layer.closeAll()">知道了</a>
			</div>
		</div>
		<!-- 点击图片全屏预览-->
		<div class="swiper-container swiper_full" id="origin-img">
			<div class="swiper-wrapper"></div>
			<div class="swiper-pagination"></div>
		</div>
	</body>
	<script type="text/javascript">
		$(function() {
			var mySwiper = new Swiper('.banner_tab', {
				loop: true, // 循环模式选项
				speed: 1000,
				// 如果需要分页器
				pagination: {
					el: '.swiper-pagination',
					clickable: true
				},
				autoplay: {
					delay: 3000,
					disableOnInteraction: false,
				},
			})
			var yuepailist = new Swiper('.yp_swiper', {
				slidesPerView: 'auto',
				spaceBetween: 10,
				speed: 300,
			})
			/*约拍地图*/
			var yuepailist = new Swiper('.yp_map_img', {
				loop: true, // 循环模式选项
				autoplay: {
					delay: 3000,
					disableOnInteraction: false,
				},
				spaceBetween: 0,
				speed: 1000,
			})
			/*创建的时候给确定按钮绑定一个方法*/
			$("#city-picker").cityPicker({
				title: "请选择地区",
				onClose: function(d) {
					console.log(this, d)
					city = (this, d.displayValue);
					alert(JSON.stringify(city))
				},
				onConfirm: function(result) {
					console.log("ss");
				}
			});
			$("#index-type").picker({
				title: "请选择类别",
				cols: [{
					textAlign: 'center',
					values: ['约拍', '活动', '寄拍', '美图']
				}],
				onClose: function(d) {
					city = (this, d.displayValue);
					alert(JSON.stringify(city))
				}
			});
		})

		function call_box() {
			layer.open({
				type: 1,
				shade: [0.5, '#000'],
				closeBtn: 0,
				anim: 0,
				shadeClose: true,
				scrollbar: false, // 是否允许屏幕滚动
				title: false, // 是否显示标题
				content: $(".callme_box") // 捕获的元素
			});
		}
	</script>

</html>